import React from "react";
import View from "../base/View";
import defaultData from "./data";
import {ImgUpload} from "../../../../common/fileupload";
import {viewTypes} from "../../../../../constants/form";
import './index.less';

const { MOBILE_WX } = viewTypes;

export default class PictureView extends View {
  renderContent(data, value) {
    const { viewType, toggleFooterDisable } = this.props;

    return (
      <ImgUpload ecId={`${this && this.props && this.props.ecId || ''}_ImgUpload@eo2emc`}
        modeId={data.formmodeId}
        maxNum={data.maxNum}
        iswx={MOBILE_WX === viewType}
        onChange={this.handleValueChange}
        onUploading={toggleFooterDisable}
        files={value}
      />
    );
  }


  renderForReadonly(data, value) {
    const files = value;

    return (
      <div className={'wea-edc-upload-img'}>
        {
          files.map(({ img, link }) => (
            <div className={`wea-edc-upload-container`} onClick={() => { this.showDocFile(link) }}>
              <div className='clearfix wea-edc-upload-item'>
                <div className='wea-edc-upload-file-img'><img src={img} /></div>
              </div>
            </div>
          ))
        }
      </div>

    );
  }
}

PictureView.defaultProps = {
  ...View.defaultProps,
  data: defaultData,
  value: ''
};